import React, { Component } from 'react'
import { Modal, Icon } from 'antd-mobile'
import { config, myFetch, helper } from '../utils'
import { hashHistory } from 'react-router'
import moment from 'moment'

export default class ShareProject extends Component {
  constructor() {
    super()
    this.state ={
      data: {},
      succeed: false
    }
    this.onFetchDetail = this.onFetchDetail.bind(this)
    this.onShareUrl = this.onShareUrl.bind(this)
  }
  onShareUrl(id) {
    myFetch(`${config.rootApi}/project/${id}/shareurl`,{}, true, false)
      .then((rs) => {
        this.setState({
          succeed: rs.succeed
        })
        console.log(this.state.succeed)
      })
      .catch(err => helper.onPromiseError(err))
  }
  onFetchDetail(id) {
    const options = {
      method: 'POST',
      body: ''
    }
    myFetch(`${config.rootApi}/project/${id}/detail`,options, true)
      .then((rs) => {
        console.log(3333)
        this.setState({
          data: rs.value
        })
      })
      .catch(err => helper.onPromiseError(err))
  }
  componentDidMount() {
    let id = this.props.location.query.id
    this.onFetchDetail(id)
    this.onShareUrl(id)
  }
  render() {
    const { data, succeed } = this.state
    return (
      <div
        className="rt-share-project-modal"
      >
        <header className="rt-share-title">
          <span
            onClick={
              () => {
                hashHistory.goBack()
              }
            }
          >
            <Icon type="left" />
          </span>
          <span>
            <img src={require('../../statics/images/logo.png')}/>
          </span>
          <span></span>
        </header>
        <div className="cm-scrollable-container">
          <div className="-picture">
            <img src={require('../../statics/images/share_bg2_logo.png')} />
          </div>
          <div className="-total">
            <h3>{data.title}</h3>
            <div className="-item">
              <span>项目阶段：{moment(data.beginDate).format('YYYY-MM-DD')}</span>
              <span>项目起投额：{data.startAmount}</span>
            </div>
            <div>
              <span>完成度：{data.progress}%</span>
            </div>
          </div>
          <div className="-intro">
            <h4>{data.title}</h4>
            <p>{data.description}</p>
          </div>
          <div className="-rcode">
            <img src={require('../../statics/images/2code2.png')}/>
          </div>
          {/*<p>{succeed ? 1 : 0}</p>*/}
          <p className="-wenzi">
            将页面分享至朋友圈 或识别二维码关注项目
          </p>
        </div>
      </div>
      )
  }
}